<template>
    <div>
        <Sear></Sear>
        <Swipe></Swipe>
        <van-grid icon-size="60px">
            <van-grid-item v-for="item in catitemsApiData" :icon="item.image_src" />
            <van-grid-item v-for="item in catitemsApiData" :icon="item.image_src" />
        </van-grid>
       
        <div class="" v-if="show">
            秒杀倒计时
             <div>
        <van-count-down :time="time" @finish="Finish"/>
        </div>
        <img src="../../images/image.png" alt="" style="width: 100%; height: 84px">
        </div>




    </div>
</template>

<script setup>
import Sear from '@/components/Sear.vue';
import Swipe from '@/components/Swipe.vue';
import { catitemsApi } from "@/api/api";
import { ref } from 'vue'
const catitemsApiData = ref([])
catitemsApi().then(res => {
    console.log('导航数据', res);
    catitemsApiData.value = res.data.message
})
  const time = ref(30 *1000);
  let show=ref(true)
  const Finish=()=>{
    show.value=false
  }
</script>

<style lang="scss" scoped></style>